import { defineStore, StoreDefinition } from "pinia";
import { UserInfo } from './types'
/**
 * defineStore 接收两个参数

第一个参数就是模块的名称，必须是唯一的，多个模块不能重名，Pinia 会把所有的模块都挂载到根容器上
第二个参数是一个对象，里面的选项和 Vuex 差不多

其中 state 用来存储全局状态，它必须是箭头函数，为了在服务端渲染的时候避免交叉请求导致的数据状态污染所以只能是函数，而必须用箭头函数则为了更好的 TS 类型推导
getters 就是用来封装计算属性，它有缓存的功能
actions 就是用来封装业务逻辑，修改 state
 */
interface NoticeResult {
  data: Array<any>
  status: number
}
export const userStore = defineStore('user', {

  state: () => {
    return {
      token: '',
      userInfo: {} as UserInfo,
      notice: {} as NoticeResult
    }
  },
  actions: {
    changeLoginState(token: string) {
      if (token) {
        localStorage.setItem('token', token)
        this.token = token
      }
    },
    changeUserInfoState(userInfo: UserInfo) {
      localStorage.setItem('userInfo', JSON.stringify(userInfo))
      this.userInfo = userInfo
    },
    changeUserNotice(notice: any) {
      this.notice = notice
    }
    // loadLocalLogin() {
    //   const token = localStorage.getItem('token')
    //   const userInfo = localStorage.getItem('userInfo')
    //   if (token) {
    //     changeLoginState(token)
    //   }
    // }
  }
})
